<script setup>
import ChartNew from '../components/ChartNew.vue'
import axios from 'axios';
import {ref} from 'vue'

const chart_data = ref({xAxis:null, yAxis:null})
const cur_avg = ref(0)



const get_data = (num)=>{
  axios({
    method: "get",
    url: "/api/get_vue_chart_data_new?num=" +  num
  }).then((res)=>{
    chart_data.value.xAxis = res.data.xAxis
    chart_data.value.yAxis = res.data.yAxis
  })
}


</script>


<template>
  <div class="about">
    <button @click="get_data(0)">Get Data 0</button>
    <button @click="get_data(1)">Get Data 1</button>
    <button>{{ cur_avg }}</button>
    <ChartNew title="test_title" :data="chart_data" @avg="(cur) => cur_avg= cur">
    </ChartNew>
    
  </div>
  
</template>

<style>
@media (min-width: 1024px) {
  .about {
    min-height: 300px;
    display: flex;
    align-items: center;
  }
}
</style>
